/**
 * 动态表单Modal组件
 * @author SPY
 * @date 2020/01/16
 */

import React from 'react';
import PropTypes from 'prop-types';
import { Modal } from 'antd';


class DynamicModal extends React.Component {

    // 定义传入属性
    static propTypes = {
        okText: PropTypes.string.isRequired,
        cancelText: PropTypes.string.isRequired,
        title: PropTypes.string.isRequired,
        width: PropTypes.number,
        visible: PropTypes.bool.isRequired,
        footer: PropTypes.object,
        confirmLoading: PropTypes.bool,
        children: PropTypes.object.isRequired,
        onCancel: PropTypes.func.isRequired,
        onSubmit: PropTypes.func.isRequired,
    }

    // 定义传入属性的默认值
    static defaultProps = {
    }

    onCancel = () => {
        const { onCancel } = this.props;
        if (onCancel && typeof onCancel === 'function') {
            onCancel();
        } else {
            console.error('请传入onCancel事件');
        }
    }

    onOk = () => {
        const { onSubmit } = this.props;
        if (onSubmit && typeof onSubmit === 'function') {
            onSubmit();
        } else {
            console.error('请传入onSubmit事件');
        }
    }

    render() {
        const {
            title,
            width,
            visible,
            footer,
            okText,
            cancelText,
            confirmLoading,
            children,
        } = this.props;

        return (
            <Modal
                title={title}
                width={width}
                visible={visible}
                destroyOnClose
                footer={footer}
                maskClosable={false}
                okText={okText}
                confirmLoading={confirmLoading}
                cancelText={cancelText}
                onCancel={this.onCancel}
                onOk={this.onOk}
            >
                {children}
            </Modal>
        );
    }
}

export default DynamicModal;